import 'package:flutter/material.dart';
import 'package:flutter_screenutil/flutter_screenutil.dart';
import 'package:signage/l10n/l10n.dart';
import 'package:signage/widgets/edit_dialog.dart';
import '../app/data/models/template_model.dart';
import 'dart:io';
import 'package:get/get.dart';

class TemplateListItem extends StatelessWidget {
  final TemplateModel template;
  final VoidCallback onTap;
  final VoidCallback onDelete;
  final VoidCallback onPin;
  final VoidCallback onCopy;
  final VoidCallback onEdit;
  final Function(String) onRename;

  const TemplateListItem({
    Key? key,
    required this.template,
    required this.onTap,
    required this.onDelete,
    required this.onPin,
    required this.onCopy,
    required this.onEdit,
    required this.onRename,
  }) : super(key: key);

  @override
  Widget build(BuildContext context) {
    return InkWell(
      onTap: onTap,
      child: Container(
        padding: const EdgeInsets.all(8),
        decoration: BoxDecoration(
          color: Colors.white,
          borderRadius: BorderRadius.circular(8),
          boxShadow: [
            BoxShadow(
              color: Colors.black.withOpacity(0.1),
              blurRadius: 4,
              offset: const Offset(0, 2),
            ),
          ],
        ),
        child: Column(
          crossAxisAlignment: CrossAxisAlignment.start,
          children: [
            // 模板信息和操作按钮
            Column(
              crossAxisAlignment: CrossAxisAlignment.start,
              children: [
                Stack(
                  children: [
                    // 添加分辨率信息
                    AspectRatio(
                      aspectRatio: template.width / template.height,
                      child: Container(
                        width: double.infinity,
                        decoration: BoxDecoration(
                          color: Colors.grey[200],
                          borderRadius: BorderRadius.circular(4),
                          image: DecorationImage(
                            image: template.filePath.startsWith('assets/')
                                ? AssetImage(template.filePath)
                                : FileImage(File(template.filePath))
                                    as ImageProvider,
                            fit: BoxFit.cover,
                          ),
                        ),
                      ),
                    ),
                    Positioned(
                      bottom: 0,
                      left: 0,
                      child: Container(
                        padding: EdgeInsets.symmetric(
                            horizontal: 8.w, vertical: 4.h),
                        decoration: BoxDecoration(
                          color: Color(0x80000000),
                          borderRadius: BorderRadius.only(
                            topRight: Radius.circular(33),
                            bottomRight: Radius.circular(33),
                          ),
                        ),
                        child: Center(
                          child: Text(
                            template.size,
                            style: TextStyle(
                              fontSize: 13.sp,
                              color: Colors.white,
                            ),
                          ),
                        ),
                      ),
                    ),
                  ],
                ),
                11.verticalSpace,
                Row(
                  children: [
                    // 标题和重命名功能
                    Expanded(
                      child: Row(
                        children: [
                          Expanded(
                            child: GestureDetector(
                              onTap: () {
                                final TextEditingController controller =
                                    TextEditingController(text: template.name);
                                Get.dialog(
                                  EditDialog(
                                    title: AppLocalizations.of(context)!.translate('template_rename'),
                                    hintText: AppLocalizations.of(context)!.translate('template_name_hint'),
                                    controller: controller,
                                    onConfirm: () {
                                      onRename(controller.text);
                                      Get.back();
                                    },
                                  ),
                                );
                              },
                              child: Row(
                                crossAxisAlignment:
                                    CrossAxisAlignment.center,
                                children: [
                                  Text(
                                    template.name,
                                    style:  TextStyle(
                                      fontSize: 16.sp,
                                      height: 20.w / 16.sp,
                                      color: Color(0XFF333333),
                                    ),
                                    overflow: TextOverflow.ellipsis,
                                  ),
                                  const SizedBox(width: 4),
                                  Image.asset('assets/images/edit@2x.png',
                                      width: 20.w, height: 20.w),
                                ],
                              ),
                            ),
                          ),
                        ],
                      ),
                    ),
                    // 功能按钮
                    Wrap(
                      runSpacing: 8,
                      verticalDirection: VerticalDirection.up,
                      children: [
                        _buildActionButton(
                          icon: Image.asset('assets/images/Frame@2x (4).png',
                              width: 20.w, height: 20.w),
                          label: AppLocalizations.of(context)!.translate('template_copy'),
                          onPressed: onCopy,
                        ),
                        _buildActionButton(
                          icon: Image.asset('assets/images/Frame@2x (5).png',
                              width: 18.w, height: 18.w),
                          label: AppLocalizations.of(context)!.translate('template_pin'),
                          onPressed: onPin,
                          isPinned: template.isPinned,
                        ),
                        if (!template.isSystemTemplate)
                          _buildActionButton(
                            icon: Image.asset('assets/images/Frame@2x (6).png',
                                width: 18.w, height: 18.w),
                            label: AppLocalizations.of(context)!.translate('template_delete'),
                            onPressed: onDelete,
                            color: Colors.red,
                          ),
                      ],
                    ),
                  ],
                ),
                4.verticalSpace
                // 模板预览图
              ],
            ),
          ],
        ),
      ),
    );
  }

  Widget _buildActionButton({
    required Widget icon,
    required String label,
    required VoidCallback onPressed,
    Color? color,
    bool isPinned = false,
  }) {
    return InkWell(
      onTap: onPressed,
      child: Container(
        padding: const EdgeInsets.symmetric(horizontal: 8, vertical: 4),
        decoration: BoxDecoration(
          color: isPinned ? Colors.blue.withOpacity(0.1) : Colors.transparent,
          borderRadius: BorderRadius.circular(4),
        ),
        child: Row(
          mainAxisSize: MainAxisSize.min,
          children: [
            icon,
          ],
        ),
      ),
    );
  }
}
